<template>
  <view class="person">
    <view class="houseManImage">
      <image
        :src="person.head_thumb"
        class="profile-photo"
        mode="aspectFill"
      ></image>
    </view>
    <view style="flex-grow: 1">
      <p>{{ person.name || '匿名' }}</p>
      <text style="font-size: 12px; color: #969799">
        {{ person.company || '启租网' }}
      </text>
    </view>
    <view
      @click="phoneCall(person.phone)"
      class="houseManIcon"
      style="margin-right: 10px"
    >
      <image
        src="../../static/phoneIcon.png"
        class=""
        style="width: 16px; left: 9px; top: 1px"
        mode="aspectFit"
      ></image>
    </view>
    <view @click="toMessaging(person, houseItem)" class="houseManIcon">
      <image
        src="../../static/messageIcon.png"
        class="houseManImage"
        style=""
        mode=""
      >
      </image>
    </view>
  </view>
</template>

<script>
import { contact } from './contact';
import { chatMixin } from '@/util/reuse/chatMixin';
import { uniGetStorageSync, uniSetStorageSync } from '../../util/funcs';
import { lastTimeHouse } from '../../util/misc';
import { CHATTER_TO } from '../../util/rongCloud/messaging';
import { proRequest } from '../../util/network';

export default {
  mixins: [contact, chatMixin],
  props: {
    person: {
      default() {
        return {
          id: 10000,
          head_thumb: 'http://qizutest.com',
          name: null,
          phone: '',
          company: '启租网',
          easemob_account_password: '', // 环信专用聊天id
        };
      },
    },
    houseItem: {
      type: Object,
    },
  },
  data() {
    return {
      subsHeadImage: '../../static/avatar.jpg',
    };
  },
  methods: {},
  mounted() {
    setTimeout(() => {
      //
      // this.readyToMessage()
    }, 100);
  },
};
</script>

<style scoped lang="scss">
@import '../../assets/styles/global';

.person {
  margin-top: 8px;
  width: 100%;
  height: 60px;
  @include center;
  justify-content: space-between;
  
  .profile-photo{
    width: 90rpx;
    height: 90rpx;
    background-color: whitesmoke;
    border-radius: 50%;
    border: 2rpx solid grey;
  }
  
  .houseManImage {
    @include borderBox;
    background-color: white;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    margin-right: 10px;
  }

  .houseManIcon {
    background-color: #f7f8fa;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    line-height: 45px;
  }

  .houseManIcon > image {
    width: 25px;
    height: 25px;
    position: relative;
    top: 2px;
    left: 5px;
  }
}
</style>
